// 引入icon样式 分号和空格不能丢
@import './icon.less';

// 全局样式
body {
  background-color: #ffffff;
}

.navTop {
  background-color: #3296fa;

  .van-nav-bar__title {
    color: #fff;
    max-width: unset;
  }
}

.containerBox {
  width: 100%;
  height: 100vh;
  position: relative;
  background-color: #f5f5f5;
  overflow-x: hidden;
}

// 自定义表单标题样式
.cardBox {
  margin-top: 18px;
  background-color: #fff;
  padding: 20px 0;

}

// 卡片样式
.cardDetail {
  display: flex;
  justify-content: flex-start;
  // padding-left: 15px;
  border-bottom: 0.02667rem solid #ebedf0;
  height: 35px;
  position: relative;
  margin: 0 0.42667rem;
  padding: 0.26667rem 0;

  .cardTitle {
    font-size: 32px;
    height: 35px;
    line-height: 40px;
    position: relative;
    padding-left: 15px;
    font-weight: bold;
    &::before {
      content: "";
      width: 8px;
      height: 100%;
      display: inline-block;
      background-color: #3b86ff;
      position: absolute;
      border-radius: 4px;
      left: 0px;
    }
  }
}

// loading
.loadingBox {
  width: 100vw;
  height: 100vh;
  position: fixed;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 99;
  // background-color: rgba(0, 0, 0, 0.692);
}

// 过度动画
.slide-right-enter-active,
.slide-right-leave-active,
.slide-left-enter-active,
.slide-left-leave-active {
  position: absolute;
  width: 100%;
  will-change: transform;
  transition: all 0.3s ease-out;
}

.slide-right-enter {
  opacity: 0;
  transform: translate(-100%, 0);
}

.slide-right-leave-active {
  opacity: 0;
  transform: translate(0%, 0);
}

.slide-left-enter {
  opacity: 0;
  transform: translate(100%, 0);
}

.slide-left-leave-active {
  opacity: 0;
  transform: translate(0%, 0);
}


